<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>add layers(point line polygon) to a map(添加图层--点、线、面)</title>
    <style>
        html,body,#viewDiv {
            padding: 0;
            margin: 0;
            height: 100%;
            width: 100%;
        }
    </style>
     <link rel="stylesheet" href="https://js.arcgis.com/4.17/esri/css/main.css">
     <!-- <link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/themes/light/main.css"> -->
     <script src="https://js.arcgis.com/4.17/"></script>
     <script>
         require([
             "esri/Map",
             "esri/views/MapView",
             "esri/layers/FeatureLayer"
         ],function(Map,MapView,FeatureLayer){
             var map = new Map({
                basemap:"topo-vector"
             });

             var view = new MapView({
                 container:"viewDiv",
                 map:map,
                 center:[-118.80543,34.02700],
                 zoom:13
             })

             // points
             var point = new FeatureLayer({
                url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0"
                
             });
             map.add(point);

             // lines
             var line = new FeatureLayer({
                url:"https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trails/FeatureServer/0",
                // add
                definitionExpressionL:"ELEV_GAIN < 250",
                // add
                renderer: {
                    type:"simple",
                    symbol: {
                        type: "simple-line",
                        color: "green",
                        width: "2px"
                    }
                },
                // add
                outFields: ["TRL_NAME", "ELEV_GAIN"],
                // add
                popupTemplate: {
                    // Enable a popup
                    title: "{TRL_NAME}", // Show attribute value
                    content: "The trail elevation gain is {ELEV_GAIN} ft." // Display text in pop-up
                }
             });
             map.add(line, 0)

             //polygons
             var polygons = new FeatureLayer({
                 url:"https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Parks_and_Open_Space/FeatureServer/0"
             });
             map.add(polygons,0)
         })
     </script>
</head>
<body>
    <div id="viewDiv"></div>
</body>
</html>